<template>
	<view>
		<u-navbar 
			back-text=""
			 back-icon-size="36" 
			 :height="height" 
			 :back-icon-name="backIconName" 
			 :title-color="titleColor"
			 :background="background"
			 :border-bottom="borderBottom"
			 :back-icon-color="backIconColor"
			 :title="title">
			 <view class="right" v-if="isShowR" @click="callBack" >
			 	清空
			 </view>
		 </u-navbar>
	</view>
</template>

<script>
	export default {
		name:"mine-head",
		props:{
			title:String,
			background:{
				type: Object,
				default() {
				  return {
					  backgroundColor:'#fff'
				  };
				},
			},
			isShowR:{
				type:Boolean,
				default:false
			},
			height:{
			  type:String,
			  default:'50'
			},
			titleColor:{
				type:String,
				default:'#000'
			},
			backIconName:{
				type:String,
				default:'arrow-leftward'
			},
			backIconColor:{
				type:String,
				default:'#000'
			},
			borderBottom:{
				type:Boolean,
				default:true
			},
		},
		data() {
			return {
				
			};
			
		},
		methods:{
			callBack(){
				this.$emit('callBack')
			}
		}
	}
</script>

<style lang="scss" scoped>
/deep/.u-title{
	font-size: 34rpx !important;
	font-family: $uni-font-family-Bold;
}
/deep/.u-back-wrap{
	background: url(@/static/img/common/topBack.png) no-repeat center / 40rpx 40rpx;
}
/deep/.u-icon-wrap{
	opacity: 0;
	padding-left: 30rpx;
}

.right{
	position: absolute;
	right: 50rpx;
	height: 46rpx;
	width: 100rpx;
	line-height: 46rpx;
	border-radius: 16rpx;
	text-align: center;
	border: 1rpx solid #ec6560;
	top: 30rpx;
	font-size: 26rpx;
	color: #ec6560;
	font-family: $uni-font-family-Bold;
}
</style>